import 'package:flutter/material.dart';

class Test9 extends StatefulWidget {
  @override
  _Test9State createState() => new _Test9State();
}

class _Test9State extends State<Test9> with SingleTickerProviderStateMixin{

    TabController _tabController;

    @override
    void initState() {
        super.initState();
        _tabController = TabController(vsync: this,length: 2);
    }

    @override
    void dispose() {
        _tabController.dispose();
        super.dispose();
    }

    @override
    Widget build(BuildContext context){
        return Scaffold(
            appBar: AppBar(
                title: Text('AppBar Bottom Widget'),
                bottom: PreferredSize(
                    preferredSize: Size.fromHeight(24),
                    child: Theme(
                        data: Theme.of(context).copyWith(accentColor: Colors.white),
                        child: Container(
                            height: 24,
                            alignment: Alignment.center,
                            child: TabPageSelector(controller: _tabController),
                        ),
                    ),
                ),
            ),
            body: TabBarView(
                controller: _tabController,
                children: <Widget>[
                    Container(
                        child: Text("mmm"),
                    ),
                    Container(
                        child: Text("mmm66"),
                    )
                ],
                // children: choices.map((Choice choice){
                //     return new Padding(
                //         padding: EdgeInsets.all(16.0),
                //         child: ChoiceCard(choice:choice),
                //     );
                // }).toList(),
            ),
        );
    }
}

class Choice{
    const Choice({this.title,this.icon});
    final String title;
    final IconData icon;
}

const List<Choice> choices = const <Choice>[
    const Choice(title: 'Car',icon: Icons.directions_car),
    const Choice(title: 'Bicycle',icon: Icons.directions_bike),
    const Choice(title: 'BOAT', icon: Icons.directions_boat),
    const Choice(title: 'BUS', icon: Icons.directions_bus),
    const Choice(title: 'TRAIN', icon: Icons.directions_railway),
    const Choice(title: 'WALK', icon: Icons.directions_walk),
];

class ChoiceCard extends StatelessWidget{
    ChoiceCard({this.choice});
    final Choice choice;
    @override
    Widget build(BuildContext context){
        return Card(
            color: Colors.white,
            child: Center(
                child: Column(
                    mainAxisSize: MainAxisSize.min,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: <Widget>[
                        Icon(choice.icon,size: 128.0,color: Colors.red),
                        Text(choice.title),
                    ],
                ),
            ),
        );
    }

}
